@page
@{ Layout = "_Layout"; }

<el-card>
    <div slot="header" class="clearfix">
        <span>{{ roleId>0 ? '修改角色' : '新增角色' }}</span>
        <el-button style="float: right;padding:3px 0;" type="text" v-on:click="utils.closeLayer(false)"><i class="el-icon-close"></i></el-button>
    </div>
    <div style="margin-right:18px;">
        <el-form v-on:submit.native.prevent ref="form" :model="form" :size="euiSize" status-icon label-width="110px">
            <el-row>
                <el-col :span="10">
                    <el-form-item label="角色名称" prop="roleName" :rules="[{ required: true, message: '请输入角色名称' }]">
                        <el-input v-model.trim="form.roleName" :disabled="form.id > 0"></el-input>
                    </el-form-item>
                    <el-form-item label="备注">
                        <el-input type="textarea" v-model.trim="form.description" :rows="8" resize="none"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="14">
                    <el-form-item label="管理范围">
                        <el-scrollbar class="scrollbar" :style="{ height: ($(window).innerHeight()-190) + 'px'}">
                            <el-tree ref="roleTree"
                                     :data="allMenus"
                                     show-checkbox check-on-click-node
                                     node-key="id"
                                     :default-checked-keys="checkdKeys"
                                     :default-expanded-keys="expandedKeys"
                                     :props="{label: 'text'}">
                            </el-tree>
                        </el-scrollbar>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

    </div>
</el-card>
<el-row align="center" style="margin-top:18px;">
    <el-col :span="24" align="center">
        <el-button icon="el-icon-check" type="primary" v-on:click="btnSubmitClick" :size="euiSize">确 定</el-button>
        <el-button icon="el-icon-close" :size="euiSize" v-on:click="btnCancelClick">取 消</el-button>
    </el-col>
</el-row>
@section Scripts{
<script src="/sitefiles/assets/js/admin/settings/administratorsRoleAdd.js" type="text/javascript"></script> }